<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			div {
				width: 200px;
				height: 200px;
				background-color: red;
				float: left;
				margin: 30px;
			}
		</style>
	</head>
	<body>
		<div>1</div>
		<div>2</div>
		<div>3</div>
		<script>
			var i = 0,
				allDiv = document.getElementsByTagName('div');
			// 点击变成黄色
			document.onclick = function() {
				var color = getRandomColor()
				console.log(color)
				console.log('点击了')
				while (i < allDiv.length) {
					allDiv[i].style.background = color;
					i++
				}
			}
			
			// 封装一个生成颜色的函数
			function getRandomColor(){
				var letters = '0123456789ABCDEF';
				var color = '#';
				for(var i = 0;i < 6;i++){
					color += letters[Math.floor(Math.random()*16)];
				}
				return color
			}
		</script>
	</body>
</html>